let laypage = layui.laypage;
let form = layui.form;


// 获取文章的参数
let data = {
    pagenum: 1, // 分页页码，比如5，表示获取第 5 页的数据
    pagesize: 2, // 每页数据的条数，比如 2 表示每一页显示 2 条数据
}



// 获取
function huoquwz() {
    $.ajax({
        url: '/my/article/list',
        data: data,
        success: function (res) {
            let arr = []
            res.data.forEach(item => {
                arr.push(`<tr>
                <td>${item.title}</td>
                <td>${item.cate_name}</td>
                <td>${item.pub_date}</td>
                <td>${item.state}</td>
                <td>
                  <a href="./edit.html?id=${item.id}" class="layui-btn layui-btn-xs">编辑</a>
                  <button type="button" class="layui-btn layui-btn-danger layui-btn-xs">删除</button>
                </td>
              </tr>`)
            });
            $('tbody').html(arr.join(""))
            fenyehs(res.total)
        }
    })
}
huoquwz()

// 分页
function fenyehs(x) {
    //执行一个laypage实例
    laypage.render({
        elem: 'fenye', //这里的ID，不用加 # 号
        count: x, //数据总数，从服务端得到
        limit: data.pagesize, // 每页显示几条数据
        curr: data.pagenum, // 当前页
        limits: [2, 3, 5, 10],
        layout: ['count', 'limit', 'prev', 'page', 'next', 'skip'], // 自定义排版
        // jump函数，当切换分页时触发；页面刷新时也会触发
        jump: function (obj, first) {
            // 首次不执行（页面刷新时，first=true； 后续点击页码时，first=undefined）
            if (!first) {
                // do something
                // obj包含了当前分页的所有参数，比如：
                // console.log('当前页：', obj.curr); // 得到当前页，以便向服务端请求对应页的数据。
                // console.log('每页几条数据：', obj.limit); // 得到每页显示的条数
                // 当切换页码之后，只需要修改 ajax 请求参数，然后重新发送请求获取数据即可
                data.pagenum = obj.curr;
                data.pagesize = obj.limit;
                huoquwz();
            }
        }
    });
}

// 筛选

// 渲染下拉框
$.ajax({
    url: '/my/category/list',
    // data: data,
    success: function (res) {
        console.log(res);
        let arr = []
        res.data.forEach(item => {
            arr.push(`<option value="${item.id}">${item.name}</option>`)
        })
        $('#xiala1').append(arr.join(''))
        form.render('select')
    }
})

// 点击筛选
$('#saixuan').on('submit', function (e) {
    e.preventDefault();
    let state = $('#xiala2').val()
    let cate_id = $('#xiala1').val()
    console.log(state);
    console.log(cate_id);
    if (state) {
        data.state = state
    } else {
        delete data.state
    }
    if (cate_id) {
        data.cate_id = cate_id
    } else {
        delete data.cate_id
    }

    data.pagenum = 1;
    huoquwz()

})

